body,
html {
    height: 100%;
    padding: 0;

    color: #333;
    background-color: white;

    font-family: "Lato", sans-serif;
    font-size: 14px;
    line-height: 1.6;
}

body {
    position: relative;
    /* font: 16px/24px Ubuntu, sans-serif; */

    min-width: 990px;

    color: #000000;
    background: #fff;
}

.article-page-wrap {
    position: relative;

    min-height: 100vh;
    padding-bottom: 350px;
}

body>*:first-child {
    margin-top: 0 !important;
}

body>*:last-child {
    margin-bottom: 0 !important;
}


/*hamburguer*/

.navbar-toggle {
    margin-top: 23px;
}

.navbar-default .navbar-toggle .icon-bar {
    background-color: #fff;
}

.navbar-default .navbar-nav {
    padding: 0.5em 1em;
}

.navbar-default .navbar-nav>li>a,
.doc-menu>li,
.doc-menu>li>a {
    text-decoration: none;

    color: #fff;
}

.navbar-default .navbar-nav>li>a:hover,
.sidebar>ul>li a:hover,
.doc-menu>ul>li a:hover {
    text-decoration: underline;

    color: #65D38D;
}

.navbar-brand {
    padding: unset;
}



a {
    text-decoration: underline;

    color: #4183C4;
}

a.absent {
    color: #cc0000;
}

a.anchor {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;

    display: block;

    margin-left: -30px;
    padding-left: 30px;

    cursor: pointer;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    position: relative;

    margin: 20px 0 10px;
    padding: 0;

    cursor: text;

    font-weight: bold;

    -webkit-font-smoothing: antialiased;
}

h2:first-child,
h1:first-child,
h1:first-child+h2,
h3:first-child,
h4:first-child,
h5:first-child,
h6:first-child {
    margin-top: 0;
    padding-top: 0;
}

h1:hover a.anchor,
h2:hover a.anchor,
h3:hover a.anchor,
h4:hover a.anchor,
h5:hover a.anchor,
h6:hover a.anchor {
    text-decoration: underline;
}

h1 tt,
h1 code {
    font-size: inherit;
}

h2 tt,
h2 code {
    font-size: inherit;
}

h3 tt,
h3 code {
    font-size: inherit;
}

h4 tt,
h4 code {
    font-size: inherit;
}

h5 tt,
h5 code {
    font-size: inherit;
}

h6 tt,
h6 code {
    font-size: inherit;
}

h1 {
    color: black;

    font-size: 28px;
}

h2 {
    color: black;
    border-bottom: 1px solid #cccccc;

    font-size: 24px;
}

h3 {
    font-size: 18px;
}

h4 {
    font-size: 16px;
}

h5 {
    font-size: 14px;
}

h6 {
    color: #777777;

    font-size: 14px;
}

p,
blockquote,
ul,
ol,
dl,
li,
table,
pre {
    margin: 0;
}

hr {
    height: 4px;
    padding: 0;

    color: #cccccc;
    border: 0 none;
}

body>h2:first-child {
    margin-top: 0;
    padding-top: 0;
}

body>h1:first-child {
    margin-top: 0;
    padding-top: 0;
}

body>h1:first-child+h2 {
    margin-top: 0;
    padding-top: 0;
}

body>h3:first-child,
body>h4:first-child,
body>h5:first-child,
body>h6:first-child {
    margin-top: 0;
    padding-top: 0;
}

a:first-child h1,
a:first-child h2,
a:first-child h3,
a:first-child h4,
a:first-child h5,
a:first-child h6 {
    margin-top: 0;
    padding-top: 0;
}

h1 p,
h2 p,
h3 p,
h4 p,
h5 p,
h6 p {
    margin-top: 0;
}

li p.first {
    display: inline-block;
}

ul,
ol {
    padding-left: 30px;
}

ul :first-child,
ol :first-child {
    margin-top: 0;
}

ul :last-child,
ol :last-child {
    margin-bottom: 0;
}

blockquote {
    padding: 0 15px;

    color: #777777;
    border-left: 4px solid #dddddd;
}

blockquote> :first-child {
    margin-top: 0;
}

blockquote> :last-child {
    margin-bottom: 0;
}

table {
    padding: 0;
}

table tr {
    margin: 0;
    padding: 0;

    border-top: 1px solid #cccccc;
    background-color: white;
}

table tr:nth-child(2n) {
    background-color: #f8f8f8;
}

table tr th {
    margin: 0;
    padding: 6px 13px;

    text-align: left;

    border: 1px solid #cccccc;

    font-weight: bold;
}

table tr td {
    margin: 0;
    padding: 6px 13px;

    text-align: left;

    border: 1px solid #cccccc;
}

table tr th :first-child,
table tr td :first-child {
    margin-top: 0;
}

table tr th :last-child,
table tr td :last-child {
    margin-bottom: 0;
}

img {
    max-width: 100%;
}

span.frame {
    display: block;
    overflow: hidden;
}

span.frame>span {
    display: block;
    float: left;
    overflow: hidden;

    width: auto;
    margin: 13px 0 0;
    padding: 7px;

    border: 1px solid #dddddd;
}

span.frame span img {
    display: block;
    float: left;
}

span.frame span span {
    display: block;
    clear: both;

    padding: 5px 0 0;

    color: #333333;
}

span.align-center {
    display: block;
    clear: both;
    overflow: hidden;
}

span.align-center>span {
    display: block;
    overflow: hidden;

    margin: 13px auto 0;

    text-align: center;
}

span.align-center span img {
    margin: 0 auto;

    text-align: center;
}

span.align-right {
    display: block;
    clear: both;
    overflow: hidden;
}

span.align-right>span {
    display: block;
    overflow: hidden;

    margin: 13px 0 0;

    text-align: right;
}

span.align-right span img {
    margin: 0;

    text-align: right;
}

span.float-left {
    display: block;
    float: left;
    overflow: hidden;

    margin-right: 13px;
}

span.float-left span {
    margin: 13px 0 0;
}

span.float-right {
    display: block;
    float: right;
    overflow: hidden;

    margin-left: 13px;
}

span.float-right>span {
    display: block;
    overflow: hidden;

    margin: 13px auto 0;

    text-align: right;
}

code,
tt {
    margin: 0 2px;
    padding: 0 5px;

    white-space: nowrap;

    border: 1px solid #eaeaea;
    border-radius: 3px;
    background-color: #f8f8f8;
}

pre code {
    margin: 0;
    padding: 0;

    white-space: pre;

    border: none;
    background: transparent;
}

.highlight pre {
    overflow: auto;

    padding: 6px 10px;

    border: 1px solid #cccccc;
    border-radius: 3px;
    background-color: #f8f8f8;

    font-size: 13px;
    line-height: 19px;
}

pre {
    overflow: auto;

    padding: 6px 10px;

    border: 1px solid #cccccc;
    border-radius: 3px;
    background-color: #f8f8f8;

    font-size: 13px;
    line-height: 19px;
}

pre code,
pre tt {
    border: none;
    background-color: transparent;
}

.phalcon-logo {
    display: block;

    width: 170px;
    height: 60px;
    margin-top: 0.25em;
}

.phalcon-logo img {
    width: 100%;
}


/** NavBar */

.navbar {
    z-index: 100;

    margin: 0;

    border: none;
    background: url(../images/texture.png) repeat-x;
    -webkit-box-shadow: 0 0 3px 0 rgba(37, 82, 95, 0.9);
    box-shadow: 0 0 3px 0 rgba(37, 82, 95, 0.9);
}


/*.with-top-navbar {*/


/*margin-top: 40px;*/


/*}*/


/** Main Container */


/*.container {
    margin-left: 0;
    margin-right: 0;
}*/


/** Articles */

#articles table th,
td {
    padding-right: 10px;
    padding-left: 10px;
}


/** Footer */

.footer {
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;

    margin-top: 50px;
    padding: 60px 0 80px;

    background: url(../images/texture.png) repeat-x;
}

.footer h4 {
    text-transform: uppercase;

    color: #fff;

    font-size: 12px;
}

.footer ul {
    margin: 0;
    padding: 0;

    list-style-type: none;
}

.footer ul li {
    padding: 3px 0;
}

.footer ul li a {
    color: #f2f2f2;

    font-size: 13px;
}

.footer ul li a:hover {
    color: #c0c6cf;
    border-bottom: 1px dotted #c0c6cf;
}

.footer #license-wrapper {
    height: 85px;

    background: url(//static.phalconphp.com/www/images/phalcon3.png) 10px 0/74px 85px no-repeat;
}

.footer #license-spaccer {
    float: left;

    width: 100%;
    height: 50px;
}

.footer .license {
    margin-top: 46px;
    padding-left: 90px;

    color: #f2f2f2;
    background-size: 74px 85px;

    font-size: 12px;
    line-height: 18px;
}

.footer .license a {
    color: #f2f2f2;
    border-bottom: 1px dotted #6d7481;
}

.footer .license a:hover {
    color: #c0c6cf;
    border-bottom: 1px solid #c0c6cf;
}

.footer .design {
    margin-top: 30px;
    padding-left: 90px;

    text-transform: uppercase;

    color: #f2f2f2;

    font-size: 11px;
}

.footer .design a:hover {
    opacity: 1;
}

.footer .design a span {
    display: none;
}


/** Sidebar */

.sidebar {
    position: sticky;
    z-index: 1;
    float: left;
    top: 1em;
    left: 0;

    overflow: auto;

    width: 200px;
    height: 90vh;

    border-right: 1px solid #f0f2f1;
    background-color: #fff;

    font-size: 13px;
}

.sidebar--spacer {
    width: 14em;
    height: 10em;
}

.sidebar>ul,
.doc-menu>ul
{
    margin: 0;
    padding: 0;

    list-style: none;
}

.sidebar>ul>li,
.doc-menu>ul>li  {
    margin: 1em 0 0;
    padding: 0 0 5px;
}

.sidebar>ul>li a {
    text-decoration: none;

    color: #000000;
}

.doc-menu h4, .doc-menu>ul>li, .doc-menu>ul>li a {
    text-decoration: none;

    color: #fff;
}

.sidebar>ul>li>ul,
.doc-menu>ul>li>ul {
    display: block;

    margin: 5px 0 0;
    padding: 5px 10px 0;

    list-style: none;

    border-top: 1px solid rgba(37, 82, 95, 0.9);
}

.doc-menu>ul>li>ul{
    border-top: 1px solid rgba(234, 234, 234, 0.9);
}


/** article menu */

/*.article-menu {
    float: right;

    width: 200px;
    margin-left: 10px;
    padding-top: 20px;
    padding-left: 10px;

    border-left: 1px solid #0a6278;

    font-size: 13px;
    /*background: #eeeeee;
}*/

.article-menu {
    position: absolute;
    right: 125px;

    width: 200px;
    padding-top: 20px;
    padding-left: 10px;

    border-left: 1px solid #0a6278;

    font-size: 13px;
}

.article-menu>ul {
    margin: 0;
    padding: 0;

    list-style: none;
}

.article-menu>ul>li {
    list-style: none;
}

.article-menu>ul>li>ul {
    padding-left: 10px;

    list-style: none;
}

.article-menu>ul>li>ul>li {
    list-style: none;
}

.article-menu>ul>li>ul>li>ul {
    padding-left: 10px;

    list-style: none;
}

.article-menu>ul>li>ul>li>ul>li {
    list-style: none;
}

.article-menu>ul>li>ul>li>ul>li>ul {
    padding-left: 10px;

    list-style: none;
}

.article-content {
    width: 65%;
    margin: 1em 15em;
}

footer .container {
    width: 800px;
    margin: 0 auto;
}


/*CONTAINERS RESPONSE*/
@media screen and (max-width: 1600px) and (min-width: 320px) {
    .article-menu {
        right: 100px;
        position: fixed;
        background: white;
        z-index: 1000;
    }

}

@media screen and (max-width: 1440px) and (min-width: 320px) {
    .article-content {
        width: 60%;
        margin: 1em 15em;
    }
    footer .container {
        width: 650px;
        margin: 0 auto;
    }

}

/*SMALL SCREENS*/

@media screen and (max-width: 1280px) and (min-width: 320px) {
    body {
        min-width: 300px;
    }
    .article-page-wrap {
        min-height: auto;
        padding-bottom: 0;
    }
    .article-content {
        width: 57%;
    }
    footer .container {
        width: 550px;
    }
    .footer {
        position: relative;
    }
}

@media screen and (max-width: 1200px) and (min-width: 320px) {
    .article-menu {
        right: 0px;
    }
}


@media screen and (max-width: 992px) and (min-width: 320px) {
    .article-content,
    footer .container {
        width: 70%;
        margin-left: 233px;
    }

    .article-menu {
        position: relative;
        background: unset;
    }

}

@media screen and (max-width: 768px) and (min-width: 320px) {
    .article-content,
    footer .container {
        width: 80%;
        margin: 20px auto 0 auto;
    }
}


/*HELPERS*/


/*positioning*/

.pos-r {
    position: relative;
}


/*-------------------------MARGIN/PADDING-------------------------*/


/*margin*/

.m-a-0 {
    margin: 0;
}

.m-auto {
    margin: 0 auto;
}

.m-t-0 {
    margin-top: 0;
}

.m-r-0 {
    margin-right: 0;
}

.m-b-0 {
    margin-bottom: 0;
}

.m-l-0 {
    margin-left: 0;
}

.m-x-0 {
    margin-right: 0;
    margin-left: 0;
}

.m-y-0 {
    margin-top: 0;
    margin-bottom: 0;
}

.m-a {
    margin: 20px;
}

.m-t {
    margin-top: 20px;
}

.m-r {
    margin-right: 20px;
}

.m-b {
    margin-bottom: 20px;
}

.m-l {
    margin-left: 20px;
}

.m-x {
    margin-right: 20px;
    margin-left: 20px;
}

.m-y {
    margin-top: 20px;
    margin-bottom: 20px;
}

.m-x-auto {
    margin-right: auto;
    margin-left: auto;
}

.m-a-md {
    margin: 30px;
}

.m-t-md {
    margin-top: 1em;
}

.m-r-md {
    margin-right: 30px;
}

.m-b-md {
    margin-bottom: 30px;
}

.m-l-md {
    margin-left: 30px;
}

.m-x-md {
    margin-right: 30px;
    margin-left: 30px;
}

.m-y-md {
    margin-top: 30px;
    margin-bottom: 30px;
}

.m-a-lg {
    margin: 60px;
}

.m-t-lg {
    margin-top: 60px;
}

.m-r-lg {
    margin-right: 60px;
}

.m-b-lg {
    margin-bottom: 60px;
}

.m-l-lg {
    margin-left: 60px;
}

.m-x-lg {
    margin-right: 60px;
    margin-left: 60px;
}

.m-y-lg {
    margin-top: 60px;
    margin-bottom: 60px;
}

.m-a-xl {
    margin: 90px;
}

.m-t-xl {
    margin-top: 90px;
}

.m-r-xl {
    margin-right: 90px;
}

.m-b-xl {
    margin-bottom: 90px;
}

.m-l-xl {
    margin-left: 90px;
}

.m-x-xl {
    margin-right: 90px;
    margin-left: 90px;
}

.m-y-xl {
    margin-top: 90px;
    margin-bottom: 90px;
}

.m-a-2xl {
    margin: 200px;
}

.m-t-2xl {
    margin-top: 200px;
}

.m-r-2xl {
    margin-right: 200px;
}

.m-b-2xl {
    margin-bottom: 200px;
}

.m-l-2xl {
    margin-left: 200px;
}

.m-x-2xl {
    margin-right: 200px;
    margin-left: 200px;
}

.m-y-2xl {
    margin-top: 200px;
    margin-bottom: 200px;
}

.m-a-3xl {
    margin: 500px;
}

.m-t-3xl {
    margin-top: 250px;
}

.m-r-3xl {
    margin-right: 250px;
}

.m-b-3xl {
    margin-bottom: 250px;
}

.m-l-3xl {
    margin-left: 250px;
}

.m-x-3xl {
    margin-right: 250px;
    margin-left: 250px;
}

.m-y-3xl {
    margin-top: 500px;
    margin-bottom: 500px;
}


/*padding*/

.p-a-0 {
    padding: 0 !important;
}

.p-t-0 {
    padding-top: 0 !important;
}

.p-r-0 {
    padding-right: 0 !important;
}

.p-b-0 {
    padding-bottom: 0 !important;
}

.p-l-0 {
    padding-left: 0 !important;
}

.p-x-0 {
    padding-right: 0 !important;
    padding-left: 0 !important;
}

.p-y-0 {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

.p-a {
    padding: 20px !important;
}

.p-t {
    padding-top: 20px !important;
}

.p-r {
    padding-right: 20px !important;
}

.p-b {
    padding-bottom: 20px !important;
}

.p-l {
    padding-left: 20px !important;
}

.p-x {
    padding-right: 20px !important;
    padding-left: 20px !important;
}

.p-y {
    padding-top: 20px !important;
    padding-bottom: 20px !important;
}

.p-a-md {
    padding: 30px !important;
}

.p-t-md {
    padding-top: 30px !important;
}

.p-r-md {
    padding-right: 30px !important;
}

.p-b-md {
    padding-bottom: 30px !important;
}

.p-l-md {
    padding-left: 30px !important;
}

.p-x-md {
    padding-right: 30px !important;
    padding-left: 30px !important;
}

.p-y-md {
    padding-top: 30px !important;
    padding-bottom: 30px !important;
}

.p-a-lg {
    padding: 60px !important;
}

.p-t-lg {
    padding-top: 60px !important;
}

.p-r-lg {
    padding-right: 60px !important;
}

.p-b-lg {
    padding-bottom: 60px !important;
}

.p-l-lg {
    padding-left: 60px !important;
}

.p-l-xl {
    padding-left: 90px !important;
}

.p-x-lg {
    padding-right: 60px !important;
    padding-left: 60px !important;
}

.p-y-lg {
    padding-top: 60px !important;
    padding-bottom: 60px !important;
}

.p-y-xl {
    padding-top: 61px !important;
    padding-bottom: 61px !important;
}


/*-------------------------/.MARGIN/PADDING-------------------------*/
